import React, { useState } from "react";
import { MovieOutline } from "antd-mobile-icons";
import { Button } from "antd-mobile";


export default (props: { src: string }) => {
  const [play, setPlay] = useState(false)
  return play ? <video style={{ maxWidth: '100%' }} controls autoPlay={false} src={props.src}/> : <Button onClick={() => {
    setPlay(true)
  }}>
    <MovieOutline fontSize={128}/>
  </Button>
}
